陣痛期開始

會議上，PM 把新專案的技術規格攤開來。前端那一欄選型寫著 React 。

我沒說話。我只是在心裡默默地把過去三年累積的肌肉記憶——ng指令、@Input()/@Output()、switchMap——全部打包，放進一個叫做「暫時用不到」的資料夾。

然後默默回家打開 React 的官方文件。

轉換技術的衝擊清單

從沒有AI學Angular到現在慶幸好險有AI。我把第一次問AI有關從零開始寫React專案時會遇到的轉換問題後，
心裡冒出的OS記了下來，現在看覺得蠻好笑的：

「module 在哪裡？」
沒有 module。也沒有要你註冊什麼。你 import 什麼就用什麼。我盯著那個 App.tsx 看了很久，一直覺得好像少了一個檔案。

「所以……誰負責產生 component？」
你自己。手動開一個 .tsx，寫一個 function，export default。沒有 CLI 問你要不要 inline template、要不要 skip tests。第一次手動建檔案的時候，甚至有種在咦這樣就好了嗎的罪惡感。再也沒有用框架指令幫我產元件了...

「為什麼每個專案長得都不一樣？」
這是最大的衝擊。Angular 的專案你閉著眼睛都知道 core/、shared/、features/ 在哪。React生態沒有這個共識，十個專案有十一種結構。自由，但也代表沒有人會幫你擋下爛決定。

「這個 useEffect 的第二個參數是什麼意思？」
這題我到現在還在付學費。之後會有不少篇來講一下學hook的感受，一直試著用舊觀念理解新世界。

「Service 呢？誰偷走我的 Service 呢？」
沒有 Service，也沒有 DI。那些原本被 Angular 好好收納起來的東西，現在散落在 custom hooks、context、或某個人隨手 export 的 module 裡。

這個系列想做什麼

網路上的 React 大神教學已經夠多值得學習了，我再寫一份沒有任何意義。

但那些教學有一個共同點：作者大多是 React 原生使用者。對他們來說，沒有 DI 是理所當然的、useEffect 是自然的、手動處理競態條件是日常。他們不會停下來說「這裡本來應該有東西」，因為在他們的世界裡，那裡從來就沒有東西。對我這個小菜雞就不一樣了。

但我會。因為我是帶著包袱過來的。

所以這三十天，我希望能寫出一份對照筆記。如果未來有人跟我一樣希望可以笑著看，每一篇都在回答同一個問題：

這件事，以前框架幫我做了。現在該由誰來做？

有時候答案是「你自己做」，有時候是「裝一個套件」，有時候是「你其實不需要做」。第三種是最有趣的，因為那通常代表 Angular 幫我解決的，是一個它自己製造出來的問題。

三十天預計的路線圖

希望不要寫著就慢慢發現不對勁要改week目標

Week 1　心智模型重建
DI、生命週期、變更偵測、props 與 @Input。這週處理的是最底層的世界觀差異。

Week 2　RxJS 的戒斷
switchMap 變成 AbortController、forkJoin 變成 Promise.all、debounceTime 要自己刻。以及：為什麼 React 世界需要 TanStack Query。

Week 3　工程化的落差
Angular CLI 的一條龍 vs Vite 的自組裝、模組邊界、表單、測試。

Week 4　企業級實戰
真實專案的踩坑紀錄，各種專案常用套件換了框架該如何實作。

Day 30　回頭看
轉完一圈之後，Angular跟React有哪些設計我現在才懂為什麼要那樣做。

最後

報名截止日當天才按下送出鍵，某種程度上很符合這個系列的精神：準備永遠不會完全足夠，痛苦來了還是得開始。

三十天，我們慢慢來。

明天先從稍微陣痛的開始講：constructor(private http: HttpClient)這一行不見了之後，我的依賴注入到底該從哪裡來。